// 引入 react 依赖
import React, { Component } from 'react';
import { connect } from 'react-redux';
import { Text, View, Image, TouchableOpacity, ImageBackground, ScrollView, InteractionManager } from 'react-native';
import * as ActionTypes from '../../constants/constants.js';

// 引入第三方依赖
import _ from 'lodash';
import pureRender from 'pure-render-decorator';
import { Actions } from 'react-native-router-flux';
import Icon from 'react-native-vector-icons/Ionicons';

// antd 按需加载
import { Tabs, Toast, Portal } from '@ant-design/react-native';

// 引入 处理数据 所需文件
import { deliveryAddressInsert, invoiceList, invoiceDefault, invoiceGet, invoiceDel, deliveryAddressUpdate } from '../../module/module.js'

// 引入样式
import Style from './style/style.js';

// 引入公用组件
import { Status, NavBar, RefreshScrollView, LoadingData } from '../../components/index.js'

// 引入专用组件
import { } from './components'

// 引入工具包
import { press, size, ScreenWidth, borderBottom, hotTextColor, defaultDataList, onEndReached, onRefresh, concatDataList, defaultPage } from '../../util/utils.js'

class Invoice extends Component {

  constructor(props) {
    super(props)
    this.state = {
      refreshing: false,

    }
  }

  componentDidMount() {
    // this.invoiceList()
  }

  componentWillReceiveProps(props) {
  }

  // 列表
  invoiceList(options) {
    this.loading = Toast.loading('加载中', 0)
    invoiceList().then(res => {
      Portal.remove(this.loading)
    }).catch(error => {
      Portal.remove(this.loading)
    }).finally(() => {
      Portal.remove(this.loading)
    })
  }

  // 获取默认
  invoiceDefault(options) {
    invoiceDefault().then(res => {

    })
  }

  // 通过id获取
  invoiceGet(options) {
    invoiceGet().then(res => {

    })
  }
  // 通过ID删除
  invoiceDel(options) {
    invoiceDel().then(res => {

    })
  }
  // 修改
  deliveryAddressUpdate(options) {
    deliveryAddressUpdate().then(res => {

    })
  }

  onRefresh = () => {
    this.setState({ refreshing: true });
    this.invoicesList.props.request().then(res => {
      this.setState({
        refreshing: false
      })
    }).catch(error => {
      this.setState({
        refreshing: false
      })
    })
  }

  render() {
    const { refreshing } = this.state
    const { invoicesList, method, dispatch } = this.props
    return (
      <View style={Style.container}>
        <Status />
        <NavBar
          title="发票管理"
          back={true}
        />
        <RefreshScrollView
          style={Style.content}
          refreshing={refreshing}
          onRefresh={this.onRefresh}
        >
          <LoadingData
            ref={(r) => this.invoicesList = r}
            request={() => {
              return invoiceList()
            }}
            data={invoicesList}
            rowItem={(item, index) => {
              return (
                <View
                  key={index}
                  style={{
                    overflow: 'hidden',
                    backgroundColor: '#fff',
                    zIndex: 0,
                    padding: 15,
                    paddingRight: 0,
                    flexDirection: 'row',
                    alignItems: 'center',
                    ...borderBottom()
                  }}
                >
                  <TouchableOpacity
                    style={{
                      flex: 1
                    }}
                    onPress={() => {
                      console.log(method)
                      if (method && method == 'select') {
                        dispatch({
                          type: ActionTypes.setSubmitOrderInvoice,
                          data: item
                        })
                        Actions.pop()
                      }
                    }}
                  >
                    <View style={{
                      alignItems: 'center',
                      flexDirection: 'row',
                      marginBottom: 8
                    }}>
                      {item.isDefault == 1 && <View style={{ backgroundColor: '#E5C67B', paddingVertical: 3, paddingHorizontal: 8, borderRadius: 4, marginRight: 15 }}><Text style={{ fontSize: 12, color: '#fff', }}>默认</Text></View>}
                      {item.invoiceRise == 1 && <View style={{ backgroundColor: '#19BC9D', paddingVertical: 3, paddingHorizontal: 8, borderRadius: 4, marginRight: 15 }}><Text style={{ fontSize: 12, color: '#fff', }}>个人</Text></View>}
                      {item.invoiceRise == 2 && <View style={{ backgroundColor: '#F29737', paddingVertical: 3, paddingHorizontal: 8, borderRadius: 4, marginRight: 15 }}><Text style={{ fontSize: 12, color: '#fff', }}>单位</Text></View>}
                      <Text style={{ fontSize: 16, color: '#8B8B8D', lineHeight: 18, }}>{item.name}</Text>
                      <Text style={{ fontSize: 16, color: '#8B8B8D', lineHeight: 18, marginLeft: 15 }}>{item.taxNumber}</Text>
                    </View>
                    <View
                      style={{
                        flexDirection: 'row',
                        alignItems: 'center',
                      }}
                    >
                      <Text style={{ fontSize: 14, color: '#61676F', marginRight: 12 }}>
                        {item.regAddress}
                      </Text>
                    </View>
                  </TouchableOpacity>
                  <View style={{}}>
                    <TouchableOpacity
                      onPress={() => {
                        Actions.editInvoice({ id: item.id })
                      }}
                      style={{
                        padding: 15
                      }}
                    >
                      <Icon name="md-create" size={22} color={'#61676F'} />
                    </TouchableOpacity>
                  </View>
                </View>
              )
            }}
          >
          </LoadingData>
        </RefreshScrollView>
        <View style={{ padding: 15, backgroundColor: '#fff' }}>
          <TouchableOpacity
            onPress={() => {
              Actions.creatInvoice()
            }}
            style={{
              paddingVertical: 14,
              paddingHorizontal: 20,
              backgroundColor: hotTextColor,
              borderRadius: 6,
              alignItems: 'center',
              justifyContent: 'center',
            }}
          >
            <Text style={{ fontSize: size(28), color: '#fff', lineHeight: size(30), }}>添加发票</Text>
          </TouchableOpacity>
        </View>
      </View>
    );
  }
}


export default connect(({ user, invoicesList, defaultInvoice }) => ({
  user, invoicesList, defaultInvoice
}))(pureRender(Invoice))
